import { Component, OnInit, Input } from '@angular/core';
import { SharedConfigService } from '../../config/shared-config.service';

@Component({
    selector: 'cmb-progress-bar',
    templateUrl: './progress-bar.component.html',
    styleUrls: ['./progress-bar.component.scss']
})
export class ProgressBarComponent implements OnInit {

    public _height = '30px';
    public _radius = '15px';
    public _percent = '0%';
    public _isRadius = true;
    @Input() set percent(p: number) {
        this._percent = `${p}%`;
    };

    @Input() color;

    @Input() backgroundColor = '#cccccc';

    @Input() set height(h: string) {
        const nh = h.split('px')[0];
        if (nh) {
            this._height = `${nh}px`;
            this._radius = `${parseInt(nh, 10) / 2}px`;
        }
    }

    @Input() set isRadius(ir: boolean) {
        this._isRadius = ir;
    }

    get radius(): string {
        if (this._isRadius) {
            return this._radius;
        } else {
            return '0px';
        }
    }

    constructor(sharedConfigService: SharedConfigService) {
        this.color = sharedConfigService.baseColor || '#237FD4';
    }

    ngOnInit() {
    }

}
